<style type="text/css">
    .ui.add.modal .label_fl{ min-width:5em;}
    .ui.edit.modal .label_fl{ min-width:5em;}
</style>
<div class="cont">
    <div class="position">
        <img alt="位置图标" src="dist/images/position.png" />系统管理&gt;员工管理
        <a ng-click="openDetail()" ng-hide="$needClientCache" title="打开新窗口查看"><i class="large External icon"></i></a>
    </div>
     <div class="mybackground">
        <div class="cont_fr_top">
            <div class="menus_top">
                <div class="menus_l"> 员工状态</div>
                <ul id="nav">
                    <li ng-if="search_param.status == -2" class="selected"  ><a  >全部</a></li>
                    <li ng-if="search_param.status != -2" ><a   ng-click="search_param.status=-2" >全部</a></li>
                    <li ng-if="search_param.status == 1" class="selected" ><a   >试用员工</a></li>
                    <li  ng-if="search_param.status != 1"  ><a   ng-click="search_param.status=1" >试用员工</a></li>
                    <li ng-if="search_param.status == 2" class="selected"><a    >正式员工</a></li>
                    <li ng-if="search_param.status != 2"  ><a    ng-click="search_param.status=2" >正式员工</a></li>
                    <li  ng-if="search_param.status == -1" class="selected" ><a  >离职员工</a></li>
                    <li ng-if="search_param.status != -1"><a    ng-click="search_param.status=-1" >离职员工</a></li>
                </ul>
                <div class="cont_fr_btn">
                    <div class="fr" style="height: 20px;">
                        <button class="cont_f_btn3" ng-click="addUser()" >新增员工</button>
                        <button class="cont_f_btn1" ng-click="delAll()">批量删除员工</button>
                    </div>
                </div>
            </div>
            <div class="menus">
                <div class="menus_con">
                    <div class="ui form">
                        <div class="four fields">
                            <div class="inline field">
                                <label>综合查询：</label>
                                <input type="text" ng-model="search_param.user" placeholder="登陆名/姓名/电话"  style="width:160px">
                            </div>
                            <div class="inline field">
                                <label>员工岗位：</label>
                                <div class="ui selection dropdown"  style="min-width:160px;">
                                    <input type="text"  style="display:none;"   ng-model="search_param.role">
                                    <div class="default text">默认为所有岗位</div>
                                    <i class="dropdown icon"></i>
                                    <div class="menu" >
                                        <div class="item" data-value="-1"  >所有岗位</div>
                                        <div class="item" data-value="{{vitem.role_id}}" ng-repeat="vitem in roles|tree2Arr:'_child'" >{{vitem.rep}}{{vitem.role_name}}</div>
                                    </div>
                                </div>
                            </div>
                            <div class="inline field">
                                <label for="textfield" class="li_lable">员工部门:</label>
                                <div class="ui selection dropdown"  style="min-width:160px;">
                                    <input type="text"  style="display:none;"  ng-model="search_param.sector">
                                    <div class="default text">默认为所有部门</div>
                                    <i class="dropdown icon"></i>
                                    <div class="menu" >
                                        <div class="item" data-value="-1"  >所有部门</div>
                                        <div class="item" data-value="{{vitem.sector_id}}" ng-repeat="vitem in sectors|tree2Arr:'_child'" >{{vitem.rep}}{{vitem.sector_name}}</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="fields">
                            <div class="inline field"  style="margin-left: 5.7em;">
                                <button class="clear_btn" ng-click="search()">查询</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <table class="ui yellow table">
        <thead>
            <tr>
                <th><input class="check_all" id="check_all" type="checkbox" /></th>
                <th>登陆名</th>
                <th> 姓名</th>
                <th>部门信息</th>
                <th>岗位</th>
                <th>电话</th>
                <th>最后活动时间</th>
                <th>状态</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody id="y_user_list">
            <tr ng-repeat="vuser in users">
                <td>
                    <input type="checkbox" class="check_list" name="chbids" value="{{vuser.user_id}}"/>
                </td>
                <td>{{vuser.login_name}}</td>
                <td>{{vuser.nickname}}</td>
                <td>{{vuser.sname}}</td>
                <td>{{vuser.rname}}</td>
                <td>{{vuser.phone}}</td>
                <td>{{vuser.last_time}}</td>
                <td>
                    <span user-status status="{{::vuser.state}}"></span>
                </td>
                <td>
                    <a href="javascript:void(0);" ng-click="editUser(vuser['user_id']);">编辑</a>&nbsp;
                    <a href="javascript:void(0);" ng-click="chageRoleSector( vuser['user_id'] )">部门岗位</a>&nbsp;
                    <a href="javascript:void(0);" ng-click="resetPass( vuser['user_id'] )">重置密码</a>
                </td>
            </tr>
        </tbody>
        <tbody id="w_user_list" ng-show="users.length==0">
            <tr>
                <td colspan="9" style=" text-align:center;color: red;width: 100%;border: 1px solid #ccc;font-size: 16px;">没有找到数据~~~</td>
            </tr>
        </tbody>
        <tfoot ng-if="pagerdata.pageAll>1">
            <tr>
                <th colspan="9">
                    <div class="ui pagination menu" jspagination page-object="pagerdata" page-func="getPageData" id="user_listpage"></div>
                </th>
            </tr>
        </tfoot>

    </table>
</div>

<!-- 密码重置 -->
<div class="ui reset_pass modal">
    <i class="close icon"></i>
    <div class="header_h4">
        密码重置
    </div>
    <div class="content">
        <form action="#" name="pwd_reset" id="pwd_reset">
            <div class="ui form">
                <div class="fields">
                    <div class="six wide field">
                        <label class="label_fl">登陆帐号:</label>
                        <div style="min-width:160px;float:left;">{{resetData.login_name}}</div>
                    </div>
                    <div class="six wide field">
                        <label class="label_fl">员工姓名:</label>
                        <div style="min-width:160px;float:left;">{{resetData.nickname}}</div>
                    </div>
                </div>
                <div class="fields">
                    <div class="six wide field required">
                        <label class="label_fl">密码:</label>
                        <input type="text" name="pwd"  style="width:160px;float:left;"  ng-model="resetData.pwd" >
                    </div>
                    <div class="ui right aligned">
                        <div class="ui warning message" style="display:block;">
                            密码至少6个字符
                        </div>
                    </div>
                </div>
                
            </div>
        </form>
    </div>
    <div class="actions ">
        <div class="ui blue button positive" ng-click="userchpwd()">确定</div>
        <div class="ui grey negative button" >取消</div>
    </div>
</div>
<!-- //密码重置 -->

<!-- 修改用户部门及岗位 -->
<div class="ui js modal">
    <i class="close icon"></i>
    <div class="header_h4">
        修改用户部门及岗位
    </div>
    <div class="content">
        <div class="ui form">
            <div class="fields">
                <div class="six wide field">
                    <label class="label_fl">登录名：</label>
                    <div style="min-width:160px;float:left;">{{userRoleSector.login_name}}</div>
                </div>
                <div class="six wide field">
                    <label class="label_fl">姓名：</label>
                    <div style="min-width:160px;float:left;">{{userRoleSector.nickname}}</div>
                </div>
                <div class="six wide field">
                    <label class="label_fl">手机号码:</label>
                    <div style="min-width:160px;float:left;">{{userRoleSector.phone}}</div>
                </div>
            </div>
            <div class="fields">
                <div class="six wide field">
                    <label class="label_fl">微信：</label>
                    <div style="min-width:160px;float:left;">{{userRoleSector.weixin}}</div>
                </div>
                <div class="six wide field">
                    <label class="label_fl">QQ：</label>
                    <div style="min-width:160px;float:left;">{{userRoleSector.qq}}</div>
                </div>
                <div class="six wide field">
                    <label class="label_fl">邮箱</label>
                    <div style="min-width:160px;float:left;">{{userRoleSector.email}}</div>
                </div>
            </div>
            <div class="two fields">
                <div class="six wide field required">
                    <label class="label_fl">部门</label>
                    <div class="ui selection dropdown rs_sector"  style="min-width:160px;float:left;">
                        <input  type="text"  style="display: none;" ng-model="userRoleSector.sector_id">
                        <div class="default text">选择员工所属部门</div>
                        <i class="dropdown icon"></i>
                        <div class="menu" >
                            <div class="item" data-value="{{vitem.sector_id}}" ng-repeat="vitem in sectors|tree2Arr:'_child'" >{{vitem.rep}}{{vitem.sector_name}}</div>
                        </div>
                    </div>
                </div>
                <div class="six wide field">
                    <label class="label_fl">岗位</label>
                    <div class="ui selection dropdown rs_role"  style="min-width:160px;float:left;">
                        <input  type="text"  style="display: none;" ng-model="userRoleSector.role_id">
                        <div class="default text">选择员工所属岗位</div>
                        <i class="dropdown icon"></i>
                        <div class="menu" >
                            <div class="item" data-value="{{vitem.role_id}}" ng-repeat="vitem in roles|tree2Arr:'_child'" >{{vitem.rep}}{{vitem.role_name}}</div>
                        </div>
                    </div>
                </div>
                <div class="six wide field">
                </div>
            </div>
        </div>
    </div>
    <div class="actions ">
        <div class="ui blue button positive">确定</div>
        <div class="ui grey negative button" >取消</div>
    </div>
</div>
<!-- 添加新用户 -->
<div class="ui add modal">
    <i class="close icon"></i>
    <div class="header_h4">
        添加新用户
    </div>
    <div class="content">
        <form class="ui form" action="#" name="addfrm" id="addfrm">
            <div class="ui form">
                <div class="fields">
                    <div class="six wide field required" >
                        <label class="label_fl">登陆名</label>
                        <input type="text" name="name" ng-model="addData.login_name" ng-readonly="1" style="width:160px;float:left;" placeholder="请填写登录名" >
                    </div>
                    <div class="six wide field required">
                        <label class="label_fl"> 姓名</label>
                        <input type="text" name="nickname" ng-model="addData.nickname" style="width:160px;float:left;" placeholder="请填写 姓名" >
                    </div>
                    <div class="six wide field">
                        <label class="label_fl">手机号码</label>
                        <input type="text" name="phone" ng-model="addData.phone" style="width:160px;float:left;" placeholder="请填写手机号码" >
                    </div>
                </div>
                <div class="fields">
                    <div class="six wide field required">
                        <label class="label_fl">部门</label>
                        <div class="ui selection dropdown"  style="min-width:160px;float:left;">
                            <input  type="text"  style="display: none;" ng-model="addData.sector_id">
                            <div class="default text">选择员工所属部门</div>
                            <i class="dropdown icon"></i>
                            <div class="menu" >
                                <div class="item" data-value="{{vitem.sector_id}}" ng-repeat="vitem in sectors|tree2Arr:'_child'" >{{vitem.rep}}{{vitem.sector_name}}</div>
                            </div>
                        </div>
                    </div>
                    <div class="six wide field">
                        <label class="label_fl">岗位</label>
                        <div class="ui selection dropdown"  style="min-width:160px;float:left;">
                            <input  type="text"  style="display: none;" ng-model="addData.role_id">
                            <div class="default text">选择员工所属岗位</div>
                            <i class="dropdown icon"></i>
                            <div class="menu" >
                                <div class="item" data-value="{{vitem.role_id}}" ng-repeat="vitem in roles|tree2Arr:'_child'" >{{vitem.rep}}{{vitem.role_name}}</div>
                            </div>
                        </div>
                    </div>
                    <div class="six wide field required">
                        <label class="label_fl">状态</label>
                        <div class="ui left icon input" style="width:160px;float:left;">
                            <select class="ui dropdown add_state" name="status"  ng-model="addData.state">
                                <option value="2" selected>正式员工</option>
                                <option value="-1">离职员工</option>
                                <option value="1">试用员工</option>
                                <option value="0">禁止登陆</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="fields">
                    <div class="six wide field" >
                        <label class="label_fl">微信</label>
                        <input type="text" name="weixin" style="width:160px;float:left;"   ng-model="addData.weixin"  placeholder="请填写微信" >
                    </div>
                    <div class="six wide field" >
                        <label class="label_fl">QQ</label>
                        <input type="text" name="qq"   ng-model="addData.qq"  style="width:160px;float:left;" placeholder="请填写QQ" >
                    </div>
                    <div class="six wide field">
                        <label class="label_fl">邮箱</label>
                        <input type="text" name="mail"   ng-model="addData.email"  style="width:160px;float:left;" placeholder="请填写邮箱地址" >
                    </div>
                </div>
                <div class="fields">
                    <div class="six wide field required" >
                        <label class="label_fl">密码</label>
                        <input type="text" name="pwd" id="pwd"  ng-model="addData.pwd"   style="width:160px;float:left;" placeholder="请填写密码(至少6个字符)" >
                    </div>
                    <div class="six wide field" >
                        <label class="label_fl">证书姓名</label>
                        <input type="text"    ng-model="addData.teacher_name"  style="width:160px;float:left;" placeholder="资格证书注册名字" >
                    </div>
                    <div class="six wide field">
                        <label class="label_fl">证书编号</label>
                        <input type="text"   ng-model="addData.cert_num"  style="width:160px;float:left;" placeholder="请填写老师资格证书编号" >
                    </div>
                </div>
            </div>
        </form>
    </div>
    <div class="actions ">
        <div class="ui blue button positive">确定</div>
        <div class="ui grey negative button" >取消</div>
    </div>
</div>
<!-- 编辑用户信息 -->
<div class="ui edit modal">
    <i class="close icon"></i>
    <div class="header_h4">
        编辑用户信息
    </div>
    <div class="content">
        <form class="ui form" action="#" id="editfrm" name="editfrm">
            <input type="hidden" name="edit_userid" id="edit_userid">
            <div class="ui form">
                <div class="fields">
                    <div class="six wide field required">
                        <label class="label_fl">登录名</label>
                        <input type="text" name="edit_name" ng-model="editData.login_name"  ng-readonly="1" style="width:160px;float:left;" placeholder="请填写登录名" >
                    </div>
                    <div class="six wide field required">
                        <label class="label_fl">姓名</label>
                        <input type="text" name="edit_nickname" ng-model="editData.nickname"  style="width:160px;float:left;"   placeholder="请填写 姓名" >
                    </div>
                    <div class="six wide field">
                        <label class="label_fl">手机号码</label>
                        <input type="text" name="edit_phone" ng-model="editData.phone" style="width:160px;float:left;"  placeholder="请填写手机号码" >
                    </div>
                </div>
                <div class="fields">
                    <div class="six wide field" >
                        <label class="label_fl">微信</label>
                        <input type="text" name="edit_weixin"  ng-model="editData.weixin"  style="width:160px;float:left;" placeholder="请填写微信" >
                    </div>
                    <div class="six wide field"  >
                        <label class="label_fl">QQ</label>
                        <input type="text" name="edit_qq" ng-model="editData.qq"  style="width:160px;float:left;"  placeholder="请填写QQ" >
                    </div>
                     <div class="six wide field"  >
                        <label class="label_fl">状态</label>
                        <select class="ui dropdown edit_state" name="edit_status" ng-model="editData.state"   style="width:160px;float:left;"  >
                            <option value="2" selected="true">正式员工</option>
                            <option value="-1">离职员工</option>
                            <option value="1">试用员工</option>
                            <option value="0">禁止登陆</option>
                        </select>
                     </div>
                </div>
                <div class="fields">
                    <div class="six wide field" >
                        <label class="label_fl">邮箱</label>
                        <input type="text" name="edit_email"  ng-model="editData.email" style="width:160px;float:left;" placeholder="请填写邮箱地址" >
                    </div>
                    <div class="six wide field" >
                        <label class="label_fl">证书姓名</label>
                        <input type="text"    ng-model="editData.teacher_name"  style="width:160px;float:left;" placeholder="资格证书注册名字" >
                    </div>
                    <div class="six wide field">
                        <label class="label_fl">证书编号</label>
                        <input type="text"   ng-model="editData.cert_num"  style="width:160px;float:left;" placeholder="请填写老师资格证书编号" >
                    </div>
                </div>
            </div>
        </form>
    </div>
    <div class="actions ">
        <div class="ui blue button positive">确定</div>
        <div class="ui grey negative button" >取消</div>
    </div>
</div>
<div class="ui small reset_confirm modal transition">
    <div class="header_h4">确定密码重置</div>
    <div class="content">
        <p>确定要重置用户【{{resetData.nickname}}】密码吗？</p>
    </div>
    <div class="actions ">
        <div class="ui blue button positive">确定</div>
        <div class="ui grey negative button" >取消</div>
    </div>
</div>

<div class="ui small msg modal transition"  id="msg-model" >
    <div class="header_h4"></div>
    <div class="content">
        <p></p>
    </div>
    <div class="actions ">
        <div class="ui blue button positive">确定</div>
        <div class="ui grey negative button" >取消</div>
    </div>
</div>
<!-- 系统信息弹出层 -->
<div class="ui systemerror modal transition" >
    <div class="header_h4">
        系统提示
    </div>
    <div class="content">
        <div class="inline fluid fields">
            <div class="field" style="display: inline-block;width: 5%;" ng-show="userRcode==1">
                <i class="thumbs up large icon"></i>
            </div>
            <div class="field" style="display: inline-block;width: 5%;" ng-show="userRcode==0">
                <i class="thumbs down large icon"></i>
            </div>
            <div class="field" style="display: inline-block;">
                <p>{{userMsg}}</p>
            </div>
        </div>
    </div>
    <div class="actions ">
        <div class="ui blue  positive button">关闭</div>
    </div>
</div>
<style type="text/css">
.ui.dropdown.selection{width: 100%;}
</style>
<script type="text/javascript">
    $(function(){
        $('.ui.dropdown').dropdown({
            onChange:function(value, text, $choice){
                $($choice).parent().parent().find('input').val( value );
                $($choice).parent().parent().find('input').trigger('change');
            }
        });
        //添加用户验证
        $('#addfrm').form({
            on: 'blur',
            inline : true,
            fields: {
                name: {
                    identifier: 'name',
                    rules: [
                        {
                            type   : 'empty',
                            prompt : '登录名不能为空'
                        },
                        {
                            type:'minLength[2]',
                            prompt : '登录名至少为2个字符'
                        }
                    ]},
                nickname: {
                    identifier: 'nickname',
                    rules: [
                      {
                        type   : 'empty',
                        prompt : ' 姓名不能为空'
                      }
                    ]},
                sector: {
                    identifier: 'sector',
                    rules: [
                      {
                        type   : 'empty',
                        prompt : '部门不能为空'
                      }
                    ]},
                length:{
                identifier: 'phone',
                optional   : true,
                rules: [
                  {
                    type   : 'length[11]',
                    prompt : '请填写正确的电话号码'
                  },
                  {
                    type: 'maxLength[11]',
                    prompt: '请填写正确的电话号码'
                  }
                ]},
                qq:{
                identifier: 'qq',
                optional   : true,
                rules: [
                  {
                    type   : 'integer',
                    prompt : '请输入QQ号码'
                  }
                ]},
                mail:{
                identifier: 'mail',
                optional   : true,
                rules: [
                  {
                    type   : 'email',
                    prompt : '请填写正确的邮箱格式'
                  }
                ]},

            }});
        //编辑用户验证
        $('#editfrm').form({
            on: 'blur',
            inline : true,
            fields: {
                edit_name: {
                    identifier: 'edit_name',
                    rules: [
                        {
                            type   : 'empty',
                            prompt : '登录名不能为空'
                        },
                        {
                            type:'minLength[2]',
                            prompt : '登录名至少为2个字符'
                        }
                    ]},
                edit_nickname: {
                    identifier: 'edit_nickname',
                    rules: [
                      {
                        type   : 'empty',
                        prompt : ' 姓名不能为空'
                      }
                    ]},
                length:{
                identifier: 'edit_phone',
                optional   : true,
                rules: [
                  {
                    type   : 'length[11]',
                    prompt : '请填写正确的电话号码'
                  },
                  {
                    type: 'maxLength[11]',
                    prompt: '请填写正确的电话号码'
                  }
                ]},
                edit_qq:{
                identifier: 'edit_qq',
                optional   : true,
                rules: [
                  {
                    type   : 'integer',
                    prompt : '请输入QQ号码'
                  }
                ]},
                edit_mail:{
                identifier: 'edit_mail',
                optional   : true,
                rules: [
                  {
                    type   : 'email',
                    prompt : '请填写正确的邮箱格式'
                  }
                ]},

            }});
        //重置密码验证
        $('#pwd_reset').form({
            on: 'blur',
            inline : true,
            fields: {
                czpwd:{
                identifier: 'pwd',
                rules: [
                  {
                    type   : 'empty',
                    prompt : '密码不能为空'
                  },
                  {
                    type:'minLength[6]',
                    prompt : '新密码至少为6位'
                  }
                ]}
            }});
    });
</script>